<template>

  <div>
    <el-breadcrumb separator="/" style="padding-bottom:20px;">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item to="/setup">系统管理</el-breadcrumb-item>
      <el-breadcrumb-item>数据字典</el-breadcrumb-item>
    </el-breadcrumb>

    <el-container direction="vertical">

      <fm-grid url="/api/v1/sdict" ref="grid" method="get" :params="['kw']">

        <template slot-scope="{rows,loading,search}">

          <div class="filter-container">
            <el-input style="width: 200px;" size="small" v-model="query.kw" class="filter-item"
                      placeholder="请输入姓名或用户名"/>

            <el-button class="filter-item" size="small" style="margin-left: 10px;" @click="search(query,1)"
                       type="primary" icon="search">搜索
            </el-button>
            <div style="float:right;margin-right:20px;">
              <el-button type="text" icon="document" @click="$refs.dictae.add()">
                添加
              </el-button>
            </div>

          </div>


          <el-table
            :data="rows"
            stripe
            v-loading="loading"
            style="width: 100%;padding-bottom:20px;border-bottom:none;">
            <el-table-column
              prop="code"
              label="编码"
              width="180">
            </el-table-column>
            <el-table-column
              prop="name"
              label="名称"
              width="180">
            </el-table-column>
            <el-table-column
              prop="description"
              label="描述"
              width="180">
            </el-table-column>
            <el-table-column
              label="操作">
              <template slot-scope="{row}">
                <el-button type="text" @click="edit(row)">编辑</el-button>
              </template>
            </el-table-column>
          </el-table>
        </template>

      </fm-grid>
      <dict-ae @success="$refs.grid.search()" ref="dictae"/>
    </el-container>


  </div>

</template>

<script>

  import DictAe from "./DictAe";

  export default {

    components:{DictAe},

    mounted(){
      this.$nextTick(() => {
        const { kw } = this.$route.query
        this.query = {...this.query, kw}
      });
    },

    data(){
      return {
        query:{}
      }
    },

    methods:{


      edit(row){
        this.$refs.dictae.edit(row.id);
      },

      passowrdEdit(row){

      }

    }

  }

</script>

